<template>
  <div id="test4">
    <p>{{ msg | format }}</p>
    <p>{{ msg1 | format }}</p>
    <p>{{ msg2 | format }}</p>
    <p>{{ num | format }}</p>
    <el-input v-model="num" placeholder="请输入内容"></el-input>
  </div>
</template>

<script type="text/ecmascript-6">
  export default {
    name: 'test4',
    data () {
      return {
        msg: '2654321.7888',
        msg1: '2654321.7',
        msg2: '2654321.74',
        num: '2000'
      }
    },
    filters: {
      format: (val) => {
        let arr = []
        if (val.indexOf('.') !== -1) {
          let valList = val.split('.')
          arr.push(valList[0].slice(0, valList[0].length % 3))
          for (let i = valList[0].length % 3; i < valList[0].length; i += 3) {
            arr.push(valList[0].slice(i, i + 3))
          }
          valList[0] = arr.join(',')
          if (valList[1].length > 2) {
            valList[1] = valList[1].slice(0, 2)
          } else if (valList[1].length < 2) {
            valList[1] = valList[1] + 0
          }
          return valList.join('.')
        } else {
          arr.push(val.slice(0, val.length % 3))
          for (let i = val.length % 3; i < val.length; i += 3) {
            arr.push(val.slice(i, i + 3))
          }
          return arr.join(',') + '.00'
        }
      }
    },
    created () {

    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus">

</style>
